<template>
  <jl-base>
    <jl-header>
      <mt-header title="登录单明细" :fixed="true">
        <i slot="left">
          <mt-button icon="back" @click="back"></mt-button>
        </i>
      </mt-header>
      <mt-navbar v-model="selected" class="mt35">
        <mt-tab-item id="base">基本信息</mt-tab-item>
        <mt-tab-item id="goods">商品信息</mt-tab-item>
      </mt-navbar>
    </jl-header>

    <jl-content style="height: calc(100% - 83px);!important;margin-top: 0px">
      <mt-tab-container v-model="selected">
        <mt-tab-container-item id="base">
          <div>
            <div class="w12">
              <div class="dld_title"><span>工程类型</span></div>
              <div class="dld_body">
                <button class="xuan">
                  {{list.GCLX}}
                </button>
              </div>
            </div>
            <div class="w12">
              <div class="dld_title">
                <span>使用单位</span>
              </div>
              <div class="dld_body">
                <jl-from-input label="用户姓名" disabled v-model="list.YHXM"/>
                <jl-from-input label="用户电话" disabled v-model="list.YHDH"/>
                <jl-from-input label="单位名称" disabled v-model="list.SYDW"/>
              </div>

              <div class="dld_title">
                <span>购买单位</span>
              </div>
              <div class="dld_body">
                <jl-from-input label="联系人" disabled v-model="list.LXR"/>
                <jl-from-input label="联系电话" disabled v-model="list.LXDH"/>
                <jl-from-input label="单位名称" disabled v-model="list.GMDW"/>
                <jl-from-input v-model="list.AZDZ1" disabled label="地址"/>
                <jl-from-input label="预计安装日期" disabled v-model="list.YJAZRQ"/>
              </div>

              <div class="dld_title">
                <span>厂家资料</span>
              </div>
              <div class="dld_body">
                <jl-from-input label="经销商名称" disabled v-model="list.JXSMC"/>
                <jl-from-input label="经销商电话" disabled v-model="list.JXSDH"/>
                <jl-from-input label="厂家业务员" disabled :text="list.GCGZR"/>
                <jl-from-input label="厂家业务员电话" disabled v-model="list.GZRDH"/>
                <jl-from-input label="经销商业务员" disabled v-model="list.JXRLXR"/>
                <jl-from-input label="经销商业务员电话" disabled v-model="list.JXSLXDH"/>
                <jl-from-input label="工程用途" disabled v-model="list.GCYT"/>
                <jl-from-textarea placeholder="工程描述" v-model="list.GCMS"/>
                <jl-from-input label="面积" disabled v-model="list.MJ"/>
                <jl-from-input label="匹数" disabled v-model="list.PS"/>
                <jl-from-input label="是否团购工程" disabled v-model="list.SFTGGC"/>
              </div>
            </div>

            <template v-for="(item,index) in list.AZDZLB">
              <div class="w12">
                <div class="dld_title">
                  <span>安装地址（{{index + 1}}）</span>
                </div>
                <div class="dld_body">
                  <jl-from-input label="联系人" disabled placeholder="请输入安装地址联系人" v-model="item.LXR"/>
                  <jl-from-input label="联系电话" disabled placeholder="请输入安装地址联系人电话" v-model="item.LXDH"/>
                  <jl-address label="安装地址" disabled
                              v-model="item.AZDZ"
                  />
                </div>
              </div>
            </template>
          </div>
        </mt-tab-container-item>

        <mt-tab-container-item id="goods">
          <div>
            <template v-for="(item,index) in list.SPLB">
              <div class="w12">
                <div class="dld_title"><span>商品信息({{index+1}})</span>
                </div>
                <div class="dld_body">
                  <jl-from-input :value="item.GCSPBM +'-'+ item.GCSPMC" label="商品" disabled/>
                  <jl-from-input v-model="item.SQSL" disabled label="申请数量"/>
                  <jl-from-textarea placeholder="商品备注信息" v-model="item.BZ"/>
                </div>
              </div>
            </template>
          </div>
        </mt-tab-container-item>
      </mt-tab-container>
    </jl-content>
  </jl-base>
</template>

<script>

  export default {

    data() {
      return {
        selected: 'base',
        jlbh: '',
        bdbh: '',
        list: {},
      }
    },
    methods: {
      back() {
        this.$router.back();
      },
      initData() {
        this.http.find('SCM_GCDLD', {
          bdbh: this.bdbh,
          jlbh: this.jlbh
        }).then(v => {
          if ($Utils.isNull(v)) return
          let azdz = v[0]['AZDZ1'];
          let AZDZ1 = '';
          if (!$Utils.isNull(azdz)) {
            for (let i = 0; i < azdz.length; i++) {
              if (i == 0) {
                AZDZ1 = azdz[i]['VALUE']
              } else {
                AZDZ1 = AZDZ1 + '-' + azdz[i]['VALUE']
              }
            }
          }
          v[0]['AZDZ1'] = AZDZ1;
          v[0]['GCLX'] = v[0]['GCLX']['value'];
          v[0]['GCYT'] = v[0]['GCYT']['value'];
          //v[0]['SFTGGC'] = v[0]['SFTGGC']['value'];
          this.list = Object.assign({}, this.list, v[0])
        }).catch(e => console.log(e))
      },
    },
    created() {
      if ($Utils.isNull(this.$route.params.item)) return
      this.jlbh = this.$route.params.item['JLBH'];
      this.bdbh = this.$route.params.item['BDBH'];
      this.initData();
    }
  }
</script>

<style scoped>
</style>
